<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
{% load staticfiles %}
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>天天生鲜-商品列表</title>
	<link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}">
	<link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">
</head>
<body>
	<div class="header_con">
		<div class="header">
			<div class="welcome fl">欢迎来到天天生鲜!</div>
			<div class="fr">
                {% if user.is_authenticated %}
				<div class="login_btn fl">
					欢迎您：<em>{{ user.username }}</em>
                    <span>|</span>
					<a href="{% url 'user:logout' %}">退出</a>
				</div>
                {% else %}
				<div class="login_btn fl">
					<a href="{% url 'user:login' %}">登录</a>
					<span>|</span>
					<a href="{% url 'user:register' %}">注册</a>
				</div>
                {% endif %}
				<div class="user_link fl">
					<span>|</span>
					<a href="{% url 'user:info' %}">用户中心</a>
					<span>|</span>
					<a href="{% url 'cart:show' %}">我的购物车</a>
					<span>|</span>
					<a href="{% url 'user:order' 1 %}">我的订单</a>
				</div>
			</div>
		</div>		
	</div>

	<div class="search_bar clearfix">
		<a href="{% url 'goods:index' %}" class="logo fl"><img src="{% static 'images/logo.png' %}"></a>
		<div class="search_con fl">
			<input type="text" class="input_text fl" name="" placeholder="搜索商品">
			<input type="button" class="input_btn fr" name="" value="搜索">
		</div>
		<div class="guest_cart fr">
			<a href="{% url 'cart:show' %}" class="cart_name fl">我的购物车</a>
			<div class="goods_count fl" id="show_count">{{ count }}</div>
		</div>
	</div>

	<div class="navbar_con">
		<div class="navbar clearfix">
			<div class="subnav_con fl">
				<h1>全部商品分类</h1>	
				<span></span>			
				<ul class="subnav">
                    {% for good_type in goods_type %}
                        <li><a href="{% url 'goods:list' good_type.id %}" class="{{ good_type.logo }}">{{ good_type.name }}</a></li>
                        {% comment %}
                        <li><a href="#model02" class="seafood">海鲜水产</a></li>
                        <li><a href="#model03" class="meet">猪牛羊肉</a></li>
                        <li><a href="#model04" class="egg">禽类蛋品</a></li>
                        <li><a href="#model05" class="vegetables">新鲜蔬菜</a></li>
                        <li><a href="#model06" class="ice">速冻食品</a></li>
                        {% endcomment %}
                    {% endfor %}
				</ul>
			</div>
			<ul class="navlist fl">
				<li><a href="">首页</a></li>
				<li class="interval">|</li>
				<li><a href="">手机生鲜</a></li>
				<li class="interval">|</li>
				<li><a href="">抽奖</a></li>
			</ul>
		</div>
	</div>

	<div class="breadcrumb">
		<a href="#">全部分类</a>
		<span>></span>
		<a href="#">新鲜水果</a>
	</div>

	<div class="main_wrap clearfix">
		<div class="l_wrap fl clearfix">
			<div class="new_goods">
				<h3>新品推荐</h3>
				<ul>
                    {% for new in new_goods %}
					<li>
						<a href="{% url 'goods:detail' new.id %}"><img src="{{ new.image.url }}"></a>
						<h4><a href="{% url 'goods:detail' new.id %}">{{ new.name }}</a></h4>
						<div class="prize">￥{{ new.price }}</div>
					</li>
                    {% endfor %}
{#					<li>#}
{#						<a href="#"><img src="images/goods/goods002.jpg"></a>#}
{#						<h4><a href="#">玫瑰香葡萄</a></h4>#}
{#						<div class="prize">￥16.80</div>#}
{#					</li>#}
				</ul>
			</div>
		</div>

		<div class="r_wrap fr clearfix">
			<div class="sort_bar">
				<a href="{% url 'goods:list' current_type_id.id %}?page=1&sort=default"
                   {% if sort == 'default' %}
                   class="active"
                   {% endif %}
                >默认</a>
				<a href="{% url 'goods:list' current_type_id.id %}?page=1&sort=price"
                    {% if sort == 'price' %}
                       class="active"
                    {% endif %}
                >价格</a>
				<a href="{% url 'goods:list' current_type_id.id %}?page=1&sort=hot"
                    {% if sort == 'hot' %}
                       class="active"
                    {% endif %}
                >人气</a>
			</div>
            {% csrf_token %}
			<ul class="goods_type_list clearfix">
                {% for sku in skus %}
				<li>
					<a href="{% url 'goods:detail' sku.id %}"><img src="{{ sku.image.url }}"></a>
					<h4><a href="{% url 'goods:detail' sku.id %}">{{ sku.name }}</a></h4>
					<div class="operate">
						<span class="prize">￥{{ sku.price }}</span>
						<span class="unit">{{ sku.price }}/{{ sku.unite }}</span>
						<a href="javascript:;" class="add_goods" id="{{ sku.id }}" title="加入购物车"></a>
					</div>
				</li>
                {% endfor %}

			</ul>

			<div class="pagenation">
                {% if skus.has_previous %}
				<a href="?page={{ skus.previous_page_number }}&sort={{ sort }}"><上一页</a>
                {% endif %}

                {% for page in page_nums %}
				    <a href="?page={{ page }}&sort={{ sort }}"
                       {% if page == skus.number %}
                            class="active"
                       {% endif %}>
                    {{ page }}</a>
                {% endfor %}

                {% if skus.has_next %}
				<a href="?page={{ skus.next_page_number }}&sort={{ sort }}">下一页></a>
                {% endif %}
			</div>
		</div>
	</div>

	<div class="footer">
		<div class="foot_link">
			<a href="#">关于我们</a>
			<span>|</span>
			<a href="#">联系我们</a>
			<span>|</span>
			<a href="#">招聘人才</a>
			<span>|</span>
			<a href="#">友情链接</a>		
		</div>
		<p>CopyRight © 2016 北京天天生鲜信息技术有限公司 All Rights Reserved</p>
		<p>电话：010-****888    京ICP备*******8号</p>
	</div>

    <script type="text/javascript" src="{% static 'js/jquery-1.12.4.min.js' %}"></script>
	<script type="text/javascript">
        $(function (){
            // 列表页添加商品进入购物车
            // 获取商品ID、csrf_token、count=1
            $('.add_goods').click(function (){
                var goods_id = $(this).attr('id');
                var csrf = $('input[name=csrfmiddlewaretoken]').val();
                params = params = {'csrfmiddlewaretoken': csrf, 'goods_id': goods_id, 'count': 1};
                $.ajax({
                    'url': '{% url 'cart:add' %}',
                    'type': 'post',
                    'data': params
                }).done(function (data){
                    console.log(data.msg);
                    if (data.msg == 'ok'){
                        alert('添加成功');
                        {#window.location.href = '{% url 'goods:index' %}';#}
                    }else if(data.msg == 'error_stock_not_enough'){
                        alert("商品库存不足");
                    }
                }).fail(function (){
                    console.log("网络超时");
                })


            })
        })
    </script>
</body>
</html>